// 时间
var t = null;
t = setTimeout(time, 1000);

function time() {
	clearTimeout(t);
	dt = new Date();
	var y = dt.getFullYear();
	var mt = dt.getMonth() + 1;
	var day = dt.getDate();
	var h = dt.getHours();
	var m = dt.getMinutes();
	var s = dt.getSeconds();
	if (h < 10) {
		h = '0' + h;
	}
	if (m < 10) {
		m = '0' + m;
	}
	if (s < 10) {
		s = '0' + s;
	}
	document.querySelector(".showTime").innerHTML = '当前北京时间：' + y + "年" + mt + "月" + day + "日" + "--" + h + "时" + m + "分" + s + "秒";
	t = setTimeout(time, 1000);
}
time();


// 页面上方的内容
var reduceComfirm = document.querySelector('.no_header li:nth-child(1)');
var reduceDead = document.querySelector('.no_header li:nth-child(4)');
var reduceSuspense = document.querySelector('.no_header li:nth-child(2)');
var reduceHealth = document.querySelector('.no_header li:nth-child(3)');

// 配置axios
axios.defaults.baseURL = 'http://localhost:3000';
axios.interceptors.response.use((res) => {
	return res.data;
})

// 获取数量
axios.get('/yq/count').then((response) => {
	reduceComfirm.innerHTML = response.confirm;
	reduceDead.innerHTML = response.dead;
	reduceSuspense.innerHTML = response.suspect;
	reduceHealth.innerHTML = response.heal;
});

// 立即执行函数
!(function () {
	var chartDom = document.getElementById('reduce');
	var myChart = echarts.init(chartDom);
	var option;
	option = {
		color: ["#ff8d1a", "#364167", "#f31c73", "#a9b9cb"],
		tooltip: {
			trigger: 'axis',
			axisPointer: {
				type: 'cross',
				label: {
					backgroundColor: 'rgba(255,255,255,.6)'
				}
			}
		},
		legend: {
			textStyle: {
				color: "rgba(255,255,255,.5)",
				fontSize: "12"
			},
			data: ['累计确诊', '现有疑似', '累计治愈', '累计死亡']
		},
		grid: {
			left: "0%",
			right: "6%",
			bottom: "1%",
			top: "15%",
			containLabel: true
		},
		xAxis: [{
			type: 'category',
			boundaryGap: false,
			axisLabel: {
				color: "rgba(255,255,255,.6)",
				fontSize: "12"
			},
			data: []
		}],
		yAxis: [{
			type: 'value',
			axisLabel: {
				color: "rgba(255,255,255,.6)",
				fontSize: "12"
			},
		}],
		series: [{
				name: '累计确诊',
				type: 'line',
				areaStyle: {
					color: "#ff8d1a"
				},
				emphasis: {
					focus: 'series'
				},
				data: []
			},
			{
				name: '现有疑似',
				type: 'line',
				areaStyle: {
					color: "#364167"
				},
				emphasis: {
					focus: 'series'
				},
				data: []
			},
			{
				name: '累计治愈',
				type: 'line',
				areaStyle: {
					color: "#f31c73"
				},
				emphasis: {
					focus: 'series'
				},
				data: []
			},
			{
				name: '累计死亡',
				type: 'line',
				areaStyle: {
					color: "#a9b9cb"
				},
				emphasis: {
					focus: 'series'
				},
				data: []
			}
		]
	};
	// 获取数据
	axios.get('/yq/reduce').then((response) => {
		option.xAxis[0].data = response.day;
		option.series[0].data = response.confirm;
		option.series[1].data = response.suspect;
		option.series[2].data = response.heal;
		option.series[3].data = response.dead;
		option && myChart.setOption(option);
	})
	window.addEventListener("resize", function () {
		myChart.resize();
	});
})();

// 立即执行函数
!(function () {
	var chartDom = document.getElementById('add');
	var myChart = echarts.init(chartDom);
	var option;
	option = {
		color: ["#ff8d1a", "#364167", "#f31c73", "#a9b9cb"],
		tooltip: {
			trigger: 'axis',
			axisPointer: {
				type: 'cross',
				label: {
					backgroundColor: 'rgba(255,255,255,.6)'
				}
			}
		},
		legend: {
			textStyle: {
				color: "rgba(255,255,255,.5)",
				fontSize: "12"
			},
			data: ['新增确诊', '新增疑似', '新增治愈', '新增死亡']
		},
		grid: {
			left: "0%",
			right: "6%",
			bottom: "1%",
			top: "15%",
			containLabel: true
		},
		xAxis: [{
			type: 'category',
			boundaryGap: false,
			axisLabel: {
				color: "rgba(255,255,255,.6)",
				fontSize: "12"
			},
			data: []
		}],
		yAxis: [{
			type: 'value',
			axisLabel: {
				color: "rgba(255,255,255,.6)",
				fontSize: "12"
			},
		}],
		series: [{
				name: '新增确诊',
				type: 'line',
				areaStyle: {
					color: "#ff8d1a"
				},
				emphasis: {
					focus: 'series'
				},
				data: []
			},
			{
				name: '新增疑似',
				type: 'line',
				areaStyle: {
					color: "#364167"
				},
				emphasis: {
					focus: 'series'
				},
				data: []
			},
			{
				name: '新增治愈',
				type: 'line',
				areaStyle: {
					color: "#f31c73"
				},
				emphasis: {
					focus: 'series'
				},
				data: []
			},
			{
				name: '新增死亡',
				type: 'line',
				areaStyle: {
					color: "#a9b9cb"
				},
				emphasis: {
					focus: 'series'
				},
				data: []
			}
		]
	};
	// 获取数据
	axios.get('/yq/add').then((response) => {
		option.xAxis[0].data = response.day;
		option.series[0].data = response.confirm_add;
		option.series[1].data = response.suspect_add;
		option.series[2].data = response.heal_add;
		option.series[3].data = response.dead_add;
		option && myChart.setOption(option);
	})
	window.addEventListener("resize", function () {
		myChart.resize();
	});
})();

!(function () {
	var chartDom = document.getElementById('top');
	var myChart = echarts.init(chartDom);
	var option;
	option = {
		color: ["#3398DB"],
		tooltip: {
			trigger: "axis",
			axisPointer: {
				type: "shadow"
			}
		},
		grid: {
			left: "0%",
			top: "10px",
			right: "0%",
			bottom: "4%",
			containLabel: true
		},
		xAxis: {
			type: 'category',
			data: [],
			axisTick: {
				alignWithLabel: true
			},
			axisLabel: {
				color: "rgba(255,255,255,.6)",
				fontSize: "12"
			},
			axisLine: {
				show: false
			}
		},
		yAxis: {
			type: 'value',
			axisLabel: {
				color: "rgba(255,255,255,.6)",
				fontSize: "12"
			},
			axisLine: {
				lineStyle: {
					color: "rgba(255,255,255,.1)",
				}
			},
			splitLine: {
				lineStyle: {
					color: "rgba(255,255,255,.1)"
				}
			}
		},
		series: [{
			data: [],
			type: 'bar'
		}]
	};
	// 获取数据
	axios.get('/yq/other').then((response) => {
		option.xAxis.data = response.city;
		option.series[0].data = response.confirm;
		option && myChart.setOption(option);
	})
	window.addEventListener("resize", function () {
		myChart.resize();
	});
})();

!(function () {
	var chartDom = document.getElementById('keywords');
	var myChart = echarts.init(chartDom);
	var option;
	option = {
		tooltip: {
			trigger: 'item'
		},
		series: [{
			name: '今日疫情热搜',
			type: 'pie',
			radius: '50%',
			data: [],
			emphasis: {
				itemStyle: {
					shadowBlur: 10,
					shadowOffsetX: 0,
					shadowColor: 'rgba(0, 0, 0, 0.5)'
				}
			}
		}]
	};
	axios.get('/yq/keywords').then((response) => {
		option.series[0].data = response.kws.slice(0, 6);
		option && myChart.setOption(option);
	})
	window.addEventListener("resize", function () {
		myChart.resize();
	});
})();

!(function () {
	var chartDom = document.getElementById('map');
	var myChart = echarts.init(chartDom, 'dark');
	var option;
	option = {
		backgroundColor: "",
		title: {
			text: "",
			subtext: "",
			x: "left"
		},
		tooltip: {
			trigger: "item"
		},
		legend: {
			textStyle: {
				color: "#fff"
			}
		},
		visualMap: {
			show: true,
			x: "left",
			y: "bottom",
			textStyle: {
				fontSize: 10,
			},
			splitList: [{
				start: 1,
				end: 9
			}, {
				start: 10,
				end: 99
			}, {
				start: 100,
				end: 499
			}, {
				start: 500,
				end: 999
			}, {
				start: 1000,
				end: 4999
			}, {
				start: 5000
			}],
			color: ["#95002f", "#bd003b", "#e03355", "#ff6f6f", "#ffbaba", "#ffe8e8"],
		},
		series: [{
			name: "确诊病例",
			type: "map",
			mapType: "china",
			roam: false,
			itemStyle: {
				normal: {
					borderColor: "rgba(255, 255, 255, 0.2)",
				},
				emphasis: {
					borderWidth: 0.5,
					borderColor: "#4b0082",
					areaColor: "#c7fffd",
				}
			},
			label: {
				normal: {
					show: true,
					fontSize: 12,
					color: "rgba(255, 255, 255, 0.8)"
				},
				emphasis: {
					show: true,
					fontSize: 12,
					color: "rgba(255, 255, 255, 0.8)"
				}
			},
			data: []
		}]
	};
	axios.get('/yq/province').then((response) => {
		option.series[0].data = response.data;
		option && myChart.setOption(option);
	})
	window.addEventListener("resize", function () {
		myChart.resize();
	});
})();